<head>
    <link rel="stylesheet" href="//at.alicdn.com/t/font_1921233_vqsfmlvudvm.css">
</head>
<div class="head head_phone">
    <div class="head_return">
      <div>
          <a href="#" class="iconfont iconfanhui"> </a>
          <span>  活动详情</span>
      </div>
      
    
    </div>
    <div class="head_serch">
        <a href="#">
            <i class="iconfont iconsousuo"></i>
            请输入搜索内容
        </a>
    </div>
    <div class="top_cen rt">
        <a href="javascript:;" class="cen_k">
          <span></span>
          <span></span>
          <span></span>
        </a>
        <a class="cen_x active" >×</a>
      </div>
      <ul class="navlist_mo">                            
        <li>
          <a href="#">网站首页</a>
        </li>
        <li>
          <a href="#">线上课</a>
        </li>
        <li>
          <a href="#">线下课</a>
        </li>
        <li>
          <a href="#">展览</a>
        </li>
        <li class="mo">
            <a>关于我们</a>
            <ul class="abm_nav">
              <li><a href="#">帮助中心</a></li>
              <li><a href="#">报名指导</a> </li>
              <li><a href="#">培训指导</a> </li>
              <li><a href="#">联系我们</a> </li>
            </ul>
          </li>
      </ul>
</div>
<script>
     //点击切换导航栏按钮  手机端
     $('.head_phone').on('click','.top_cen a',function(){
      if($(this).attr('class')!='active'){
        $(this).addClass('active');
        $(this).siblings().removeClass('active');
      }else{
        $(this).removeClass('active');
        $(this).siblings().addClass('active');
      }
      if($(this).attr('class')!='cen_x active'){
        $('body').css('right','50%');
        $('.nav_bg').fadeIn();
        $('.navlist_mo').css('right','0');
      }else{
        $('body').css('right','0');
        $('.nav_bg').fadeOut();
        $('.navlist_mo').css('right','-50%');
      }
    });
     //侧边栏点击切换效果  手机端
     $('.head_phone').on('click', '.mo>a', function () {
      if ($(this).parent().attr('class') != 'mo active') {
        $(this).parent().addClass('active');
        $(this).parent().siblings().removeClass('active');
      } else {
        $(this).parent().removeClass('active');
      }
    });
</script>